<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">



<h:head></h:head>
<body>
	<ui:composition template="/template/mainLayout.xhtml">
		<ui:param name="windowsTitle" value="Listado de vendedores"></ui:param>
		<ui:define name="headContent">
			<style type="text/css" >
				.filtroCodigo, .filtroCodigo input[type="text"]{
					width: 40px;
				}
				
				
				
			</style>
		</ui:define>
		<ui:define name="bodyContent">

				<rich:panel styleClass="centrado">
				<h:form>
				<h:inputHidden value="#{vendedorBean.vendedor.id}" id="idVendedor" />
				<h:commandButton id="vendedorModificar"
					action="#{vendedorBean.editarInit}" value=" "
					styleClass="invisible" />
				<h:commandButton id="buttonDelete" action="#{vendedorBean.eliminar}"
					value=" " styleClass="invisible"
					onclick="return confirm('¿Esta seguro de que desea eliminar el vendedor?')" />


					<fieldset class="tabla" style=" width : 400px;">
						<legend>Filtro de empleados</legend>

						<h:panelGrid columns="3" columnClasses="filtroCodigo" styleClass="fullContainer">

							<h:outputText value="Número: " styleClass="fullContainer"/>
							<h:outputText value="Nombre: " styleClass="fullContainer" />
							<h:outputText value="Apellido: " styleClass="fullContainer" />


							<h:inputText value="#{vendedorBean.vendedorFiltro.numero}" />
							<h:inputText value="#{vendedorBean.vendedorFiltro.nombre}" styleClass="fullContainer padding" />
							<h:inputText value="#{vendedorBean.vendedorFiltro.apellido}" styleClass="fullContainer padding"/>


						</h:panelGrid>
						<h:commandButton value="Filtrar"
							action="#{vendedorBean.filtrarVendedores}" styleClass="fullContainer"/>
					</fieldset>
					
					<h:panelGrid styleClass="tabla">
					
					<rich:dataTable value="#{vendedorBean.vendedores}"
						var="vendedor" id="tableVendedores" width="200px" height="150"
						selectionMode="none" rows="5" styleClass="tabla fullContainer">
						
						<rich:column style="width:40px">
						<center>
							<h:commandLink
								onclick="tabla.actionClick('#{rich:clientId('buttonDelete')}','#{rich:clientId('idVendedor')}',#{vendedor.id})">
								<h:graphicImage value="/resources/img/buttons/x.png"
									width="15" height="15" />
							</h:commandLink>
							<h:commandLink
							action="#{vendedorBean.editarInit(vendedor.id)}" 
								>
								<h:graphicImage value="/resources/img/buttons/editar.jpg"
									width="15" height="15" />
							</h:commandLink>
						</center>
						</rich:column>
						<rich:column sortable="false" label="Cod" id="cod" style="width:40px; text-align: center; ">
							<f:facet name="header">
								<h:outputText value="Cod" />
							</f:facet>
							<h:outputText value="#{vendedor.id}" />
						</rich:column>
						<rich:column id="col_2" label="Nombre" style="width:300px;">
							<f:facet name="header">
								<h:outputText value="Nombre" />
							</f:facet>
							<h:outputText value="#{vendedor.nombreCompleto}" />
						</rich:column>
						<rich:column label="Teléfono" style="width:100px; text-align:center;">
							<f:facet name="header">
								<h:outputText value="Teléfono" />
							</f:facet>
							<h:outputText value="#{vendedor.telefono}" />
						</rich:column>
					</rich:dataTable>
					</h:panelGrid>

					<rich:dataScroller for="tableVendedores" maxPages="20"
						renderIfSinglePage="false"></rich:dataScroller>
						
						</h:form>
				</rich:panel>

			



		</ui:define>
	</ui:composition>
</body>
</html>
